import 'package:flutter/material.dart';
import '../utils/widget_util.dart';

class CalculatorItem extends StatefulWidget {
  final Color activeColor;
  final Color color;
  final Widget child;
  final GestureTapCallback onTap;
  final double width,height;

  const CalculatorItem({Key key, this.activeColor, this.color, this.child, this.onTap, this.width,this.height}) : super(key: key);

  @override
  State<StatefulWidget> createState() {
    return _CalculatorItemState(activeColor, color, child, onTap, width,height);
  }
}

class _CalculatorItemState extends State<CalculatorItem> {
  bool active = false;
  final Color activeColor;
  final Color color;
  final Widget child;
  final GestureTapCallback onTap;
  final double width,height;

  _CalculatorItemState(this.activeColor, this.color, this.child, this.onTap, this.width,this.height);

  void _active(bool flag) {
    setState(() {
      active = flag;
    });
  }

  @override
  Widget build(BuildContext context) {
    double dp8 = WidgetUtil.getWidth(8);
    double dp24 = WidgetUtil.getWidth(24);
    double dp20 = WidgetUtil.getWidth(20);
    double dp4 = WidgetUtil.getWidth(16);
    double dp60 = WidgetUtil.getWidth(60);
    double dp40 = WidgetUtil.getWidth(35);
    return GestureDetector(
        // behavior: null,
        onTapDown: (arg) {
          active=true;
          setState(() {

          });
        },
        onTapUp: (arg) => _active(false),
        onTapCancel: () => _active(false),
        onTap: onTap,
        child: Container(
          alignment: Alignment.center,
            margin: EdgeInsets.fromLTRB(dp8, dp8, dp8, dp20),
            width:width??  dp60,
            height:height??  dp40,
            decoration:
                BoxDecoration(borderRadius: BorderRadius.circular(12), color: active ? activeColor : color),
            child: child));
  }
}
